<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="app">
        <h1>差值表达式</h1>
        <h3>{{ msg }}</h3>
        <h3>{{ count }}</h3>
        <h1>v-text</h1>
        <div v-text="msg"></div>
        <div v-html="testHtml"></div>
        <div v-on:mousemove="clickme">1</div>
        <h1>v-model</h1>
        <input type="text" v-model="msg">
        <input type="text" v-model="count">
    </div>
    <script src="./vue.js"></script>
    <script>
            let vm = new Vue({
                el: '#app',
                data: {
                    msg: 'Hello Vue',
                    count: 100,
                    person: { name: 'zs' },
                    testHtml: '<h1>标题1</h1><p>这是对应的内容<p>',
                    clickme: function (e) {
                        console.log(e.type)
                    }
                }
            })
            console.log(vm.msg)
            // vm.msg = { test: 'Hello' }
            vm.test = 'abc'
    </script>
</body>
</html>